<template>
  <div>
    <van-tabs v-model="active">
      <van-tab title="区域">暂无</van-tab>
      <van-tab title="方式">暂无</van-tab>
      <van-tab title="租金">
        <van-card
          v-for="item in info"
          :key="item.houseCode"
          :price="item.price + '元/月'"
          :desc="item.desc"
          :title="item.title"
          :thumb="item.houseImg"
          @click="godetail(item.houseCode)"
        >
          <template #tags>
            <van-tag plain type="danger">{{ item.tags[0] }}</van-tag>
          </template>
          <template #footer> </template> </van-card
      ></van-tab>
      <van-tab title="筛选">暂无</van-tab>
    </van-tabs>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data() {
    return {
      active: 2,
      info: null,
    }
  },
  async created() {
    // console.log(1)
    const { data } = await axios({
      url: 'http://liufusong.top:8080/houses?cityId=AREA%7Cdbf46d32-7e76-1196&stat=1&end=10',
    })
    console.log(data)
    this.info = data.body.list
  },
  methods: {
    godetail(id) {
      this.$router.push({
        name: 'detail',
        query: {
          id,
        },
      })
    },
  },
}
</script>

<style>
.van-tag--danger.van-tag--plain {
  color: #39becd !important;
  background-color: #e1f5f8;
}
</style>
